<template>
	<div class="zhengtuojianhuo">
		<van-nav-bar :fixed="true" class="navBar" title="集货揽收" left-arrow @click-left="$router.go(-1)"></van-nav-bar>




		<div class="goodsFromWarp">
				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">原容器号：</div>
						</div>

						<van-field
							 class="skuInput"
							 v-model="editForm.jhrqid"
							 placeholder="请填写原容器号"
						 />
				</div>
		</div>

				<div class="goodsFromWarp" >
						<div class="goodsInputWarp">
								<div class="goodsInputLabel">
									<div class="goodsInputBorder"></div>
									<div class="skuName">任务号：</div>
								</div>




								<div class="skuNoInput">
									{{skuData[index].bill}}
								</div>


								<div class="searchBtn">
									<button :disabled="isdisabled"  @click.stop="_getSku()" >
										<van-icon name="ellipsis" color="#1989fa"  />
									</button>
								</div>
						</div>


						<div class="goodsInputWarp">
								<div class="goodsInputLabel">
									<div class="goodsInputBorder"></div>
									<div class="skuName">目标门店：</div>
								</div>
								<div class="skuNoInput">
									{{skuData[index].ck_storeid}}
								</div>
						</div>


						<div class="goodsInputWarp">
								<div class="goodsInputLabel">
									<div class="goodsInputBorder"></div>
									<div class="skuName">源容器号：</div>
								</div>
								<div class="skuNoInput">
								{{skuData[index].mb_rqh}}
								</div>
						</div>

						<div class="goodsInputWarp">
								<div class="goodsInputLabel">
									<div class="goodsInputBorder"></div>
									<div class="skuName">品种数：</div>
								</div>
								<div class="skuNoInput">
									{{skuData[index].hzcount}}
								</div>
						</div>




						<div class="goodsInputWarp">
								<div class="goodsInputLabel">
									<div class="goodsInputBorder"></div>
									<div class="skuName">总数量：</div>
								</div>
								<div class="skuNoInput">
									{{skuData[index].jh_totqty}}
								</div>
						</div>


						<div class="goodsInputWarp">
								<div class="goodsInputLabel">
									<div class="goodsInputBorder"></div>
									<div class="skuName">目标容器：</div>
								</div>

								<van-field
									 class="skuInput"
									 v-model="editForm.jhrqid_mb"
									 placeholder="请填写目标容器"
								 />
						</div>


						<div class="xiayige">
							<div @click="shangClick()">上一个</div>
							<div style="margin-left: 20px;" @click="xiaClick()">下一个</div>
						</div>

				</div>








		<div class="skuBtn">
			<van-button type="info" :disabled="isdisabled" @click="lingquBtn()">领取任务</van-button>
			<van-button type="info" :disabled="isdisabled" @click="saveGoodsBtn()">确认</van-button>
			<!-- <van-button type="info" :disabled="isdisabled" @click="mubiaoBtn()">目标容器</van-button> -->
		</div>


		<van-overlay :show="isSkuVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="商品列表" left-arrow @click-left="isSkuVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in skuData" :key="i" class="danjuRow" @click="selectSkuClick(row,i)" >
								<van-row class="skuList">
								  <van-col span="24"> <span>商品名称：</span> {{row.subsname}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>条码：</span> {{row.barcode}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>商品编码：</span> {{row.itemid}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>箱装：</span> {{row.unit}}</van-col>
									<van-col span="12"> <span>箱数：</span> {{row.pack}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>散数：</span> {{row.qty}}</van-col>
									<van-col span="12"> <span>总数量：</span> {{row.jh_totqty}}</van-col>
								</van-row>

							</div>
					</div>
			</div>
		</van-overlay>


	</div>
</template>

<script>

export default {
  name: 'jihuolanshou',
  data() {
    return {
			editForm:{
				jhrqid:'',  //W000001  W000002
				jhrqid_mb:'',  //输入目标容器号
				jh_totqty:'',
				bill:'',
				ck_storeid:'',
				jh_totqty:'',
			},
			isdisabled:false,
			lingquData:[],
			isLingQuVisible:false,
			skuData:[
				{
					bill:'',
					subsname:'',
				}
			],
			isSkuVisible:false,
			index:0,
		};
  },
	computed: {
	   ryuser: function(){
	     return this.GWO(true).gUSER;
	   }
	},
  methods: {
		mubiaoBtn(){
			if(this.lingquData[this.index] == undefined){
							 return alert('请先查询商品哦')
			}else{
				 this.editForm.ck_storeid = this.lingquData[this.index].ck_storeid
			}
			console.log(this.editForm.ck_storeid)
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_fenbo',
					'i':this.FNULLE([
					'opmode','RQFH_qrymbrqid',
					'kqid', this.ryuser.kqid,
					'czyid',this.ryuser.operatorid,
					'ck_storeid',this.editForm.ck_storeid,
					'jhrqid_mb',this.editForm.jhrqid_mb,
				])
				}, '目标容器查询',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到目标容器查询查询")
					console.log(rtn_json_obj[0])
					if(rtn_json_obj[0].ret_ret == '-1'){
						_self.$toast(rtn_json_obj[0].ret_mess)
					}else{
						_self.$toast(rtn_json_obj[0].ret_mess)
					}
				}
			});
		},
		shangClick(){
			if(this.index == 0){
				alert('最前一条')
			}else{
				this.index --
			}
		},
		xiaClick(){
			if(this.index ==  this.skuData.length-1){
				alert('最后一条')
			}else{
				this.index ++
			}
		},
		_getSku(){
			if(this.skuData[0].bill >''){
					this.isSkuVisible = true
			}
		},
		lingquBtn(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_fenbo',
				'i':this.FNULLE([
				'opmode','JHLS_qryrqid',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'jhrqid',this.editForm.jhrqid,
				])
				},'集货揽收',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					_self.lingquData = rtn_json_obj
					console.log("得到集货揽收")
					console.log(rtn_json_obj)
					_self.skuData = rtn_json_obj
					if(_self.skuData.length > 0){
						// _self.isSkuVisible = true
					}else{
						_self.$toast.fail('暂无获取商品详情')
					}
				}
			});
		},
		selectSkuClick(row,i){
			this.index = i
			this.isSkuVisible = false
		},
		saveGoodsBtn(){
			 // console.log(this.lingquData[this.index])
			 if(this.lingquData[this.index] == undefined){
				 return alert('请先查询哦')
			 }else{
				 this.editForm.jh_totqty = this.lingquData[this.index].jh_totqty
				 this.editForm.bill = this.lingquData[this.index].bill
				 this.editForm.ck_storeid = this.lingquData[this.index].ck_storeid
				 this.editForm.jh_totqty = this.lingquData[this.index].jh_totqty
			 }

			console.log(this.editForm)
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_fenbo',
					'i':this.FNULLE([
					'opmode','JHLS_qritemid',
					'kqid', this.ryuser.kqid,
					'czyid',this.ryuser.operatorid,
					'jhrqid',this.editForm.jhrqid,
					'jhrqid_mb',this.editForm.jhrqid_mb,
					'ck_storeid',this.editForm.ck_storeid,
					'bill',this.editForm.bill,
					'jh_totqty',this.editForm.jh_totqty,
				])
				}, '集货揽收提交',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到集货揽收提交")
					console.log(rtn_json_obj[0])
					if(rtn_json_obj[0].ret_ret == '-1'){
						_self.$toast(rtn_json_obj[0].ret_mess)
					}else{
						_self.$toast(rtn_json_obj[0].ret_mess)
						_self.editForm.jh_totqty = ''
						_self.editForm.jhrqid = ''
						_self.editForm.jhrqid_mb = ''
						_self.editForm.bill = ''
						_self.editForm.subid = ''
						_self.editForm.ck_storeid = ''
						_self.editForm.jh_totqty = ''
						_self.skuData = [{
							bill:'',
						}]
					}
				}
			});
		},
  },
  mounted() {

  },
	components: {

	},
};
</script>

<style lang="scss" scoped>
	// 引入公共样式
	@import '@/assets/css/base.scss';
	@import '@/assets/css/input.scss';
	div.zhengtuojianhuo{
		padding-top: 50px;
	}

</style>
